.wrapper {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--global-border);
  border-radius: var(--border-radius-md);
}

.item {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-8);
  padding: var(--spacing-10);
}

.item + .item {
  border-top: solid 1px var(--global-border);
}

.itemHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.itemTitle {
  font-size: var(--font-size-6);
  color: var(--global-foreground);
}

.link {
  display: flex;
  gap: var(--spacing-1half);
  align-items: center;
  color: var(--primary-color);
  transition: color var(--default-hover-animation-duration)
    var(--default-timing-function);
}

.link:hover {
  color: var(--primary-hover);
}

.linkText {
  font-size: var(--font-size-2);
  text-transform: uppercase;
}

.linkIcon {
  width: 0.625rem;
  height: 0.625rem;
  transition: transform var(--default-hover-animation-duration)
    var(--default-timing-function);
}

.link:hover .linkIcon {
  transform: translateX(0.125rem);
}

.form {
  padding: var(--spacing-5);
  background: var(--overlay-5);
  border-radius: var(--border-radius-md);
}

.inputWrapper {
  position: relative;
}

.input {
  width: 100%;
  height: 36px;
  padding: var(--spacing-2) var(--spacing-3);
  padding-right: calc(var(--spacing-3) + 14px + var(--spacing-2));
  font-family: inherit;
  font-size: var(--font-size-4);
  line-height: 1.5;
  color: var(--global-foreground);
  background-color: var(--global-background);
  border: 1px solid var(--global-border);
  border-radius: var(--border-radius-md);
  transition: border-color 0.2s ease;
}

.input:hover {
  border-color: var(--overlay-30);
}

.input:focus {
  outline: none;
  border-color: var(--pane-border-hover);
}

.input:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

.input::placeholder {
  color: var(--overlay-30);
  transition: color 0.2s var(--default-timing-function);
}

.input:hover::placeholder {
  color: var(--overlay-50);
}

.removeButton {
  position: absolute;
  top: 50%;
  right: var(--spacing-3);
  z-index: 1;
  transform: translateY(-50%);
}
